FROM SPREADSHEETS TO JAVASCRIPT — Exercise Files
Waskey Press | waskeypress.com
==============================================

CONTENTS
--------
data/
  employees.json   15 employees (Finance, HR, IT, Operations, Sales)
  products.json    20 products (Hardware, Accessories, Furniture)
  orders.json      ~2,150 orders, Jan 2023 – Dec 2024
  sales.json       Same orders, wrapped for Chapter 12 dashboard project

templates/
  ch07_template.html   DOM exercises starter (Chapter 7)
  ch08_template.html   Events & DOM exercises starter (Chapter 8)
  ch09_template.html   Fetch exercises starter (Chapter 9)
  ch10_template.html   Charts exercises starter (Chapter 10)
  ch11_template.html   Forms & Tables exercises starter (Chapter 11)
  ch12_project.html    Project 1: Sales Dashboard starter (Chapter 12)
  ch13_project.html    Project 2: Data Table starter (Chapter 13)
  ch14_project.html    Project 3: Report Generator starter (Chapter 14)

solutions/
  (empty — solutions are in the Answer Key at the back of the book)
  Full solutions also available at waskeypress.com/files

DATA SHAPES
-----------
employees.json
  { "employees": [
    { "id": 1, "name": "Alice Dupont", "firstName": "Alice",
      "lastName": "Dupont", "dept": "Finance", "salary": 72000,
      "active": true, "hireYear": 2018, "role": "Financial Analyst",
      "email": "alice.dupont@example.com", "managerId": 2 }
  ]}

products.json
  { "products": [
    { "id": 1, "product_name": "ProDesk X1", "category": "Hardware",
      "unit_price": 899.00, "stock_qty": 45,
      "supplier_id": 1, "reorder_qty": 100 }
  ]}

orders.json
  { "orders": [...], "meta": { "count": 2149, "currency": "EUR", "period": "2023-2024" } }
  Each order: { id, date, customer, region, product, productId, category,
                quantity, unitPrice, total, status, salesRep }

sales.json (for Chapter 12)
  { "meta": { "generated", "currency", "records" }, "orders": [...] }
  Same fields as orders.json

HOW TO USE
----------
1. Open any template HTML file in VS Code
2. Install the Live Server extension (ms-vscode.live-server)
3. Right-click the file → Open with Live Server
4. The data/ folder must be in the same directory as your HTML file
5. Edit the <script> section to complete the exercises

QUICK FETCH PATTERN
-------------------
async function loadData() {
  const response = await fetch('data/employees.json');
  if (!response.ok) throw new Error('Failed to load');
  const data = await response.json();
  return data.employees;
}

For questions and updates: files@waskeypress.com
